<!DOCTYPE html>
<script src="resources/srcset-helper.js"></script>
<style>
    div {
        box-sizing: border-box;
        width: 40px;
        height: 13px;
        border-style: solid;
    }

    .test1 {
        border-image: -webkit-image-set(url('resources/Breakpoint.png') 1x, url('resources/Breakpoint-2x.png') 2x) 3 7 3 3 fill / 3px 7px 3px 3px;
    }

    .test2 {
        border-image: -webkit-image-set(url('resources/Breakpoint.png') 1x, url('resources/Breakpoint-2x.png') 2x) 3 7 3 3 fill;
        border-width: 3px 7px 3px 3px;
    }

    .test3 {
        border-image: url('resources/Breakpoint.png') 3 7 3 3 fill / 3px 7px 3px 3px;
    }

    .test4 {
        border-image: url('resources/Breakpoint.png') 3 7 3 3 fill;
        border-width: 3px 7px 3px 3px;
    }

    @media (-webkit-min-device-pixel-ratio: 2) {
        .test3, .test4 {
    	    border-image-source: url('resources/Breakpoint-2x.png');
    	    border-image-slice: 6 14 6 6 fill;
        }
    }
</style>
The first two tests should match the last two.<br><br>
<div class="test1"></div><br>
<div class="test2"></div><br>
<div class="test3"></div><br>
<div class="test4"></div><br>
